﻿<div ng-init="currentTab='insights'" ng-include="'Views/Menu/NewsCalendarEventMenu.html'"></div>

<form name="insightAddEditForm" novalidate>
    <div class="title-bold" style="font-size: 16px;" ng-show="insightAddEdit.isAddMode">Add Insight</div>
    <div class="title-bold" style="font-size: 16px;" ng-show="!insightAddEdit.isAddMode">Edit Insight</div>
    <div style="float: left; width: 60%; padding-right: 4%;">
        <div style="display: table; width: 99%;">
            <div class="table-row-inp">
                <div class="inp-label">
                    Choose Sector
                </div>
                <div class="inp-holder">
                    <select name="sectorSelect" class="select-box" ng-model="insightAddEdit.insight.insightSectorId" 
                            ng-disabled="insightAddEdit.isEditDisabled" style="width: 94%;">
                        <option ng-show="!insightAddEdit.isAddMode" value="">Choose Sector</option>
                        <option ng-show="insightAddEdit.isAddMode" value=null>Choose Sector</option>
                        <option ng-repeat="sectorname  in insightAddEdit.sectorNames" value="{{sectorname.id}}">{{sectorname.name}}</option>
                    </select>
                </div>
            </div>
            <div class="table-spacer">&nbsp;</div>
            <div class="table-row-inp">
                <div class="inp-label">
                    Choose Topic
                </div>
                <div class="inp-holder">
                    <select name="topicSelect" class="select-box" ng-model="insightAddEdit.insight.insightTopicId" 
                            ng-disabled="insightAddEdit.isEditDisabled" style="width: 94%;">
                        <option ng-show="!insightAddEdit.isAddMode" value="">Choose Topic</option>
                        <option ng-show="insightAddEdit.isAddMode" value=null>Choose Topic</option>
                        <option ng-repeat="topicname  in insightAddEdit.topicNames" value="{{topicname.id}}">{{topicname.name}}</option>
                    </select>
                </div>
            </div>
        </div>
            <br />
            <div style="display: table; width: 99%;">
                <div class="table-row-inp">
                    <div class="inp-label">
                        Title Of Publication *
                    </div>
                    <div class="inp-holder">
                        <input name="insightTitle" type="text" class="inp" ng-model="insightAddEdit.insight.title"
                               required ng-maxlength="200" ng-disabled="insightAddEdit.isEditDisabled">
                    </div>
                </div>
                <div class="table-spacer">&nbsp;</div>
                <div class="table-row-inp">
                    <div class="inp-label">
                        Publish Date *
                    </div>
                    <div class="inp-holder">
                        <input name="insightDatePublished" type="text" class="inp" datepicker-popup="MM/dd/yyyy" 
                               ng-model="insightAddEdit.insight.datePublished" ng-required="true"
                               ng-disabled="insightAddEdit.isEditDisabled" />
                    </div>
                </div>
                <div class="table-spacer">&nbsp;</div>
                <div class="table-row-inp">
                    <div class="inp-label">
                        Image *
                    </div>
                    <div class="inp-holder">
                        <!-- show image small -->
                        <img ng-src="{{insightAddEdit.insight.imageUrl}}" width="50" height="51" ng-show="insightAddEdit.insight.imageUrl">
                        <!-- upload files -->
                        <input type="file" id="imageInsights" ng-file-select="insightAddEdit.onSelectImage($files);" ng-disabled="insightAddEdit.isEditDisabled" accept=".png, .jpg, .jpeg" />
                        <!-- hidden image for measuring the image size -->
                        <img id="tmpImage" ng-src="{{insightAddEdit.tempImagePath}}" hidden />

                        <!-- hidden element for validation -->
                        <input name="insightImage" type="text" ng-required="true" ng-model="insightAddEdit.insight.imageUrl" hidden />

                        <!--<checkimage fileid="insightAddEdit.insight.imageId"
                                    fileurl="insightAddEdit.insight.imageUrl"
                                    ng-model="insightAddEdit.selectedFile"  />-->
                    </div>
                </div>
                <div class="table-spacer">&nbsp;</div>
                <div class="table-row-inp">
                    <div class="inp-label">
                        Publication File *
                    </div>
                    <div class="inp-holder">
                        <div class="inp-holder">
                            <span>{{insightAddEdit.insight.fileName}}</span>
                            <input name="insightFile" type="file" id="pdfInsights" ng-file-select="insightAddEdit.onSelectPDFReport($files);" ng-disabled="insightAddEdit.isEditDisabled" accept=".pdf" />
                            <!-- hidden element for validation -->
                            <input name="insightFile" type="text" ng-required="true" ng-model="insightAddEdit.insight.fileUrl" hidden />
                        </div>
                    </div>
                </div>
                <div class="table-spacer">&nbsp;</div>
                <div class="table-row-inp">
                    <div class="inp-label">
                        Unpublished Date *
                    </div>
                    <div class="inp-holder">
                        <input name="insightDateUnPublished" type="text" class="inp" datepicker-popup="MM/dd/yyyy" 
                               ng-model="insightAddEdit.insight.dateUnPublished" ng-required="true"
                               ng-disabled="insightAddEdit.isEditDisabled" />
                    </div>
                </div>
                <div class="table-spacer">&nbsp;</div>
            </div>
            <br />
            <br />
        <button class="btn-green" style="width: 151px; margin-right: 10px;" ng-click="insightAddEdit.publish();" ng-disabled="insightAddEdit.isEditDisabled || insightAddEdit.isSaveDisabled">Publish</button>
            <button class="btn-green" style="margin-right: 10px;" ng-click="insightAddEdit.saveAsDraft();" ng-disabled="insightAddEdit.isEditDisabled || insightAddEdit.isSaveDisabled">Save as Draft</button>
            <button class="btn-green" style="width: 151px;" ng-click="insightAddEdit.cancel();">Cancel</button>
        </div>
    <div style="float: left; width: 40%;">

        Executive Summary
        <div id="insightSummary" name="insightSummary" required class="editor-field" text-angular ng-model="insightAddEdit.insight.summary"
             ta-toolbar="[['h1','h2','h3'],['bold','italics','underline'],['insertLink'],['html']]"
             ta-disabled="insightAddEdit.isEditDisabled"
             style="max-width:450px">
        </div>
    </div>
    <div class="clear">&nbsp;</div>
</form>